<template>
  <div class="mod-config">
    <!-- 操作栏 -->
    <el-form>
      <el-form-item>
        <el-button size="mini" v-if="isAuth('goods:goods:save')" type="primary" @click="addOrUpdateHandle()">新增
        </el-button>
        <el-button size="mini" v-if="isAuth('goods:goods:delete')" type="danger" @click="deleteHandle()"
          :disabled="dataListSelections.length <= 0">删除</el-button>
      </el-form-item>
    </el-form>
    <el-divider></el-divider>
    <el-form :inline="true" :model="dataForm" ref="dataFormRef" @keyup.enter.native="getDataList()">
      <el-form-item>
        单位：
        <el-select size="mini" v-model="dataForm.unit" clearable placeholder="请选择" @change="getDataList()" @clear="getDataList()">
          <el-option v-for="item in units" :key="item.value" :label="item.label" :value="item.label">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        选择过滤：
        <el-select size="mini" v-model="dataForm.selectField" clearable placeholder="请选择" @change="getDataList()" @clear="getDataList()">
          <el-option v-for="item in selectFields" :key="item.value" :label="item.label" :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-select size="mini" v-model="dataForm.selectValue" clearable placeholder="请选择" @change="getDataList()" @clear="getDataList()">
          <el-option label="是" value="1"></el-option>
          <el-option label="否" value="0"></el-option>
        </el-select>
      </el-form-item>
      <!-- profit = localRetailPrice - tradePrice,
       profitRate = (localRetailPrice - tradePrice)/localRetailPrice * 100 -->
      <el-form-item>
        库存/价格/毛利过滤：
        <el-select size="mini" v-model="dataForm.priceField" clearable placeholder="请选择" @change="getDataList()" @clear="getDataList()">
          <el-option v-for="item in priceFields" :key="item.value" :label="item.label" :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-select size="mini" v-model="dataForm.priceFormula" clearable placeholder="请选择" @change="getDataList()" @clear="getDataList()">
          <el-option v-for="item in priceFormulas" :key="item.value" :label="item.label" :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-input size="mini" v-model="dataForm.priceValue" clearable type="number" placeholder="库存/价格/毛利" @blur="getDataList()" @clear="getDataList()"></el-input>
      </el-form-item>
      <el-form-item>
        查询过滤：
        <el-select size="mini" v-model="dataForm.queryField" clearable placeholder="请选择" @change="getDataList()" @clear="getDataList()">
          <el-option v-for="item in queryFields" :key="item.value" :label="item.label" :value="item.value">
          </el-option>
        </el-select>
      </el-form-item>
      <el-form-item>
        <el-input size="mini" v-model="dataForm.key" placeholder="参数名" clearable @blur="getDataList()" @clear="getDataList()"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button @click="getDataList()" size="mini" type="success">查询</el-button>
        <el-button @click="resetForm()" size="mini" type="info" >重置</el-button>
      </el-form-item>
    </el-form>
    <el-divider></el-divider>
    <el-row>
      <el-col :span="3">
        <el-input placeholder="输入关键字进行过滤" size="mini" v-model="filterText" clearable>
        </el-input>
        <el-tree class="filter-tree" ref="tree" node-key="id" :data="treeData" :props="defaultProps"
          :filter-node-method="filterNode" @node-click="handleNodeClick" default-expand-all>
        </el-tree>
      </el-col>
      <el-col :span="21">
        <!-- 表格区 -->
        <el-table size="mini" :data="dataList" border
		  v-loading="dataListLoading"
          @cell-dblclick="tableDbEdit"
		  @selection-change="selectionChangeHandle"
		  style="width: 100%; "
          :row-style="{height: '36px', padding: '0px', margin: '0'}"
          :cell-style="{padding: '0'}"
          :header-cell-style="{ background: '#fcfcfc', color: '#606266', height:'36px'}">
          >
          <el-table-column type="index" header-align="center" align="center" width="50" label="序号">
          </el-table-column>
          <el-table-column prop="goodsCode" header-align="center" align="center" width="100" sortable label="编号">
          </el-table-column>
          <el-table-column prop="barCode" header-align="center" align="center" sortable width="100" label="条形码">
            <template slot-scope="scope">
              <el-input size="mini" v-model="scope.row.barCode" v-if="showInput == `barCode${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "barCode", scope.row.barCode)' v-focus>
              </el-input>
              <span v-else>{{scope.row.barCode}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="goodsName" header-align="center" align="center" sortable width="250" label="产品名称">
            <template slot-scope="scope">
              <el-input size="mini" v-model="scope.row.goodsName" v-if="showInput == `goodsName${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "goodsName", scope.row.goodsName)' v-focus>
              </el-input>
              <span v-else>{{scope.row.goodsName}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="categoryName" header-align="center" align="center" sortable width="150" label="类别名称">
            <template slot-scope="scope">
              <el-input size="mini" v-model="scope.row.categoryName" v-if="showInput == `categoryName${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "categoryName", scope.row.categoryName)' v-focus>
              </el-input>
              <span v-else>{{scope.row.categoryName}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="genericName" header-align="center" width="200" align="center" label="通用名">
            <template slot-scope="scope">
              <el-input size="mini" v-model="scope.row.genericName" v-if="showInput == `genericName${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "genericName", scope.row.genericName)' v-focus>
              </el-input>
              <span v-else>{{scope.row.genericName}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="pinyin" header-align="center" align="center" sortable width="100" label="简拼">
            <template slot-scope="scope">
              <el-input size="mini" v-model="scope.row.pinyin" v-if="showInput == `pinyin${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "pinyin", scope.row.pinyin)' v-focus>
              </el-input>
              <span v-else>{{scope.row.pinyin}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="producingArea" header-align="center" align="center" label="产地">
            <template slot-scope="scope">
              <el-input size="mini" v-model="scope.row.producingArea" v-if="showInput == `producingArea${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "producingArea", scope.row.producingArea)' v-focus>
              </el-input>
              <span v-else>{{scope.row.producingArea}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="stockTotalNum" header-align="center" align="center" sortable width="100" label="总库存">
          </el-table-column>
          <el-table-column prop="stockUpperNum" header-align="center" align="center" label="库存上线">
            <template slot-scope="scope">
              <el-input type="number" size="mini" v-model="scope.row.stockUpperNum" v-if="showInput == `stockUpperNum${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "stockUpperNum", scope.row.stockUpperNum)' v-focus>
              </el-input>
              <span v-else>{{scope.row.stockUpperNum}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="stockLowerNum" header-align="center" align="center" label="库存下线">
            <template slot-scope="scope">
              <el-input type="number" size="mini" v-model="scope.row.stockLowerNum" v-if="showInput == `stockLowerNum${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "stockLowerNum", scope.row.stockLowerNum)' v-focus>
              </el-input>
              <span v-else>{{scope.row.stockLowerNum}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="limitBuyNum" header-align="center" align="center" sortable width="140" label="限购数量">
            <template slot-scope="scope">
              <el-input type="number" size="mini" v-model="scope.row.limitBuyNum" v-if="showInput == `limitBuyNum${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "limitBuyNum", scope.row.limitBuyNum)' v-focus>
              </el-input>
              <span v-else>{{scope.row.limitBuyNum}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="standard" header-align="center" width="130" align="center" label="规格">
            <template slot-scope="scope">
              <el-input size="mini" v-model="scope.row.standard" v-if="showInput == `standard${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "standard", scope.row.standard)' v-focus>
              </el-input>
              <span v-else>{{scope.row.standard}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="unit" header-align="center" align="center" sortable width="100" label="单位">
            <template slot-scope="scope">
              <el-select size="mini" v-model="scope.row.unit" v-if="showInput == `unit${scope.row.goodsId}`"
                @change='blurInput(scope.row, "unit", scope.row.unit)' v-focus clearable placeholder="请选择">
                <el-option v-for="item in units" :key="item.value" :label="item.label" :value="item.label">
                </el-option>
              </el-select>
              <span v-else>{{scope.row.unit}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="mnemonicName" header-align="center" align="center" label="助记名">
            <template slot-scope="scope">
              <el-input size="mini" v-model="scope.row.mnemonicName" v-if="showInput == `mnemonicName${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "mnemonicName", scope.row.mnemonicName)' v-focus>
              </el-input>
              <span v-else>{{scope.row.mnemonicName}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="wholesalePrice" header-align="center" align="center" label="批发价">
            <template slot-scope="scope">
              <el-input size="mini" type="number" v-model="scope.row.wholesalePrice" v-if="showInput == `wholesalePrice${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "wholesalePrice", scope.row.wholesalePrice)' v-focus>
              </el-input>
              <span v-else>{{scope.row.wholesalePrice}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="inPrice" header-align="center" align="center" sortable width="100" label="进价">
            <template slot-scope="scope">
              <el-input size="mini" type="number" v-model="scope.row.inPrice" v-if="showInput == `inPrice${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "inPrice", scope.row.inPrice)' v-focus>
              </el-input>
              <span v-else>{{scope.row.inPrice}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="guidePrice" header-align="center" align="center" sortable width="100" label="指导价">
            <template slot-scope="scope">
              <el-input size="mini" type="number" v-model="scope.row.guidePrice" v-if="showInput == `guidePrice${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "guidePrice", scope.row.guidePrice)' v-focus>
              </el-input>
              <span v-else>{{scope.row.guidePrice}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="salePrice" header-align="center" align="center" sortable width="100" label="售价">
            <template slot-scope="scope">
              <el-input size="mini" type="number" v-model="scope.row.salePrice" v-if="showInput == `salePrice${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "salePrice", scope.row.salePrice)' v-focus>
              </el-input>
              <span v-else>{{scope.row.salePrice}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="memberPrice" header-align="center" align="center" sortable width="100" label="会员价">
            <template slot-scope="scope">
              <el-input size="mini" type="number" v-model="scope.row.memberPrice" v-if="showInput == `memberPrice${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "memberPrice", scope.row.memberPrice)' v-focus>
              </el-input>
              <span v-else>{{scope.row.memberPrice}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="topPrice" header-align="center" align="center" sortable width="100" label="最高价">
            <template slot-scope="scope">
              <el-input size="mini" type="number" v-model="scope.row.topPrice" v-if="showInput == `topPrice${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "topPrice", scope.row.topPrice)' v-focus>
              </el-input>
              <span v-else>{{scope.row.topPrice}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="lowestPrice" header-align="center" align="center" sortable width="100" label="最低价">
            <template slot-scope="scope">
              <el-input size="mini" type="number" v-model="scope.row.lowestPrice" v-if="showInput == `lowestPrice${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "lowestPrice", scope.row.lowestPrice)' v-focus>
              </el-input>
              <span v-else>{{scope.row.lowestPrice}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="discountPrice" header-align="center" align="center" sortable width="100" label="折扣价">
            <template slot-scope="scope">
              <el-input size="mini" type="number" v-model="scope.row.discountPrice" v-if="showInput == `discountPrice${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "discountPrice", scope.row.discountPrice)' v-focus>
              </el-input>
              <span v-else>{{scope.row.discountPrice}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="profit" header-align="center" align="center" sortable width="100" label="毛利">
          </el-table-column>
          <el-table-column prop="profitRate" header-align="center" align="center" sortable width="100" label="毛利率">
          </el-table-column>
          <el-table-column prop="approvalNo" header-align="center" width="230" align="center" label="批准文号">
            <template slot-scope="scope">
              <el-input size="mini" v-model="scope.row.approvalNo" v-if="showInput == `approvalNo${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "approvalNo", scope.row.approvalNo)' v-focus>
              </el-input>
              <span v-else>{{scope.row.approvalNo}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="produceFactory" header-align="center" width="250"  align="center" label="厂家">
            <template slot-scope="scope">
              <el-input size="mini" v-model="scope.row.produceFactory" v-if="showInput == `produceFactory${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "produceFactory", scope.row.produceFactory)' v-focus>
              </el-input>
              <span v-else>{{scope.row.produceFactory}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="dosageForm" header-align="center" align="center" label="剂型">
            <template slot-scope="scope">
              <el-input size="mini" v-model="scope.row.dosageForm" v-if="showInput == `dosageForm${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "dosageForm", scope.row.dosageForm)' v-focus>
              </el-input>
              <span v-else>{{scope.row.dosageForm}}</span>
            </template>
          </el-table-column>
          <el-table-column prop="isMedicare" header-align="center" align="center" sortable width="100" label="医保">
            <template slot-scope="scope">
              <el-checkbox size="mini" v-model="scope.row.isMedicare" v-if="showInput == `isMedicare${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "isMedicare", scope.row.isMedicare)' @change='blurInput(scope.row, "isMedicare", scope.row.isMedicare)' v-focus>
              </el-checkbox>
              <span v-else>
                <el-tag v-if="scope.row.isMedicare==1" type="success">是</el-tag>
                <el-tag v-else type="warning">否</el-tag>
              </span>
            </template>
          </el-table-column>
          <el-table-column prop="isMustMedicare" header-align="center" align="center" sortable width="100" label="定点医保">
            <template slot-scope="scope">
              <el-checkbox size="mini" v-model="scope.row.isMustMedicare" v-if="showInput == `isMustMedicare${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "isMustMedicare", scope.row.isMustMedicare)' @change='blurInput(scope.row, "isMustMedicare", scope.row.isMustMedicare)' v-focus>
              </el-checkbox>
              <span v-else>
                <el-tag v-if="scope.row.isMustMedicare==1" type="success">是</el-tag>
                <el-tag v-else type="warning">否</el-tag>
              </span>
            </template>
          </el-table-column>
          <el-table-column prop="isChinaDrug" header-align="center" align="center" sortable width="100" label="中药">
            <template slot-scope="scope">
              <el-checkbox size="mini" v-model="scope.row.isChinaDrug" v-if="showInput == `isChinaDrug${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "isChinaDrug", scope.row.isChinaDrug)' @change='blurInput(scope.row, "isChinaDrug", scope.row.isChinaDrug)' v-focus>
              </el-checkbox>
              <span v-else>
                <el-tag v-if="scope.row.isChinaDrug==1" type="success">是</el-tag>
                <el-tag v-else type="warning">否</el-tag>
              </span>
            </template>
          </el-table-column>
          <el-table-column prop="isGift" header-align="center" align="center" sortable width="100" label="赠品">
            <template slot-scope="scope">
              <el-checkbox size="mini" v-model="scope.row.isGift" v-if="showInput == `isGift${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "isGift", scope.row.isGift)' @change='blurInput(scope.row, "isGift", scope.row.isGift)' v-focus>
              </el-checkbox>
              <span v-else>
                <el-tag v-if="scope.row.isGift==1" type="success">是</el-tag>
                <el-tag v-else type="warning">否</el-tag>
              </span>
            </template>
          </el-table-column>
          <el-table-column prop="isRxDrug" header-align="center" align="center" sortable width="100" label="处方药">
            <template slot-scope="scope">
              <el-checkbox size="mini" v-model="scope.row.isRxDrug" v-if="showInput == `isRxDrug${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "isRxDrug", scope.row.isRxDrug)' @change='blurInput(scope.row, "isRxDrug", scope.row.isRxDrug)' v-focus>
              </el-checkbox>
              <span v-else>
                <el-tag v-if="scope.row.isRxDrug==1" type="success">是</el-tag>
                <el-tag v-else type="warning">否</el-tag>
              </span>
            </template>
          </el-table-column>
          <el-table-column prop="status" header-align="center" align="center" sortable width="100" label="状态">
            <template slot-scope="scope">
              <!-- <el-checkbox size="mini" v-model="scope.row.status" v-if="showInput == `status${scope.row.goodsId}`"
                @blur='blurInput(scope.row, "status", scope.row.status)' @change='blurInput(scope.row, "status", scope.row.status)' v-focus>
              </el-checkbox>
              <span v-else>
                <el-tag v-if="scope.row.status==1" type="success">启用</el-tag>
                <el-tag v-else type="warning">禁用</el-tag>
              </span> -->
               <el-switch size="mini" v-model="scope.row.status" @change="saveHandle(scope.row)"></el-switch>
            </template>
          </el-table-column>
          <el-table-column prop="createTime" header-align="center" align="center" sortable width="140" label="创建时间">
          </el-table-column>
          <el-table-column prop="updateTime" header-align="center" align="center" sortable width="140" label="修改时间">
          </el-table-column>
          <el-table-column fixed="right" header-align="center" align="center" width="150" label="操作">
            <template slot-scope="scope">
              <el-button type="text" size="mini" v-if="isAuth('goods:goods:modify')"
                @click="saveCurrentRowHanlde()">保存</el-button>
              <el-button type="text" size="mini" v-if="isAuth('goods:goods:modify')"
                @click="addOrUpdateHandle(scope.row.goodsId)">修改</el-button>
              <el-button type="text" size="mini" v-if="isAuth('goods:goods:delete')"
                @click="deleteHandle(scope.row.goodsId)">删除</el-button>
            </template>
          </el-table-column>
        </el-table>
        <!-- 分页 -->
        <el-pagination @size-change="sizeChangeHandle" @current-change="currentChangeHandle" :current-page="pageIndex"
          :page-sizes="[10, 20, 50, 100]" :page-size="pageSize" :total="totalPage"
          layout="total, sizes, prev, pager, next, jumper">
        </el-pagination>
      </el-col>
    </el-row>


    <!-- 弹窗, 新增 / 修改 -->
    <add-or-update v-if="addOrUpdateVisible" ref="addOrUpdate" @refreshDataList="getDataList"></add-or-update>
  </div>
</template>

<script>
  import AddOrUpdate from './goods-add-or-update'
  export default {
    data() {
      return {
        dataForm: {
          selectField: '',
          selectValue: '',
          priceField: '',
          priceFormula: '',
          priceValue: '',
          queryField: '',
          key: '',
          unit: '',
          categoryId: null
        },
        dataList: [],
        pageIndex: 1,
        pageSize: 10,
        totalPage: 0,
        dataListLoading: false,
        dataListSelections: [],
        addOrUpdateVisible: false,
        filterText: '',
        treeData: [],
        defaultProps: {
          children: 'children',
          label: 'label'
        },
        selectFields: [],
        priceFields: [],
        queryFields: [],
        priceFormulas: [],
        units: [],
        supplies: [],
        goods: {},
        showInput: "",
        oldData: {},
        currentData: {}
      }
    },
    components: {
      AddOrUpdate
    },
    mounted() {
      this.initData();
      this.getDataList()
      this.getTreeData();
      this.getUnits();
      this.getSupplies();
    },
    watch: {
      filterText(val) {
        this.$refs.tree.filter(val);
      }
    },
    directives: {
      // 通过自定义指令实现的表单自动获得光标的操作
      focus: {
        inserted: function(el) {
          if (el.tagName.toLocaleLowerCase() == "input") {
            el.focus()
          } else {
            if (el.getElementsByTagName("input")) {
              el.getElementsByTagName("input")[0].focus()
            }
          }
          el.focus()
        }
      },
      focusTextarea: {
        inserted: function(el) {
          if (el.tagName.toLocaleLowerCase() == "textarea") {
            el.focus()
          } else {
            if (el.getElementsByTagName("textarea")) {
              el.getElementsByTagName("textarea")[0].focus()
            }
          }
          el.focus()
        }
      }
    },
    methods: {
      initData() {
        let selectFields = [{
          value: 'is_rx_drug',
          label: '是否处方'
        }, {
          value: 'is_medicare',
          label: '是否医保'
        }, {
          value: 'is_china_drug',
          label: '是否中药'
        }, {
          value: 'is_split',
          label: '是否拆零药'
        }, {
          value: 'is_can_split',
          label: '能否拆零'
        }, {
          value: 'is_monitor',
          label: '是否监控'
        }, {
          value: 'is_score',
          label: '是否积分'
        }, {
          value: 'is_discount',
          label: '是否折扣'
        }, {
          value: 'is_gift',
          label: '是否赠品'
        }, {
          value: 'is_commission',
          label: '是否提成'
        }, {
          value: 'is_first_sale',
          label: '是否首营'
        }];

        let priceFields = [{
          value: 'stock_total_num',
          label: '总库存'
        }, {
          value: 'profit',
          label: '毛利'
        }, {
          value: 'sale_price',
          label: '售价'
        }, {
          value: 'wholesale_price',
          label: '批发价'
        }, {
          value: 'guide_price',
          label: '指导零售价'
        }, {
          value: 'member_price',
          label: '会员价'
        }, {
          value: 'discount_price',
          label: '折扣价'
        }, {
          value: 'top_price',
          label: '最高价'
        }, {
          value: 'lowest_price',
          label: '最低价'
        }];

        let priceFormulas = [{
          value: 'GE',
          label: '大于等于'
        }, {
          value: 'EQ',
          label: '等于'
        }, {
          value: 'GT',
          label: '大于'
        }, {
          value: 'LE',
          label: '小于等于'
        }, {
          value: 'LT',
          label: '小于'
        }, {
          value: 'NE',
          label: '不等于'
        }, ]


        let queryFields = [{
          value: 'goods_code',
          label: '编码'
        }, {
          value: 'bar_code',
          label: '条形码'
        }, {
          value: 'goods_name',
          label: '产品名称'
        }, {
          value: 'generic_name',
          label: '通用名'
        }, {
          value: 'pinyin',
          label: '简拼'
        }, {
          value: 'producing_area',
          label: '产品区域'
        }, {
          value: 'produce_factory',
          label: '厂家'
        }, {
          value: 'dosage_form',
          label: '剂型'
        }, {
          value: 'standard',
          label: '规格'
        }, {
          value: 'effect',
          label: '效果'
        }, {
          value: 'approval_no',
          label: '批准文号'
        }, {
          value: 'brand_name',
          label: '品牌名称'
        }]

        this.selectFields = selectFields;
        this.priceFields = priceFields;
        this.priceFormulas = priceFormulas;
        this.queryFields = queryFields;
      },
      resetForm(){
        this.$nextTick(() =>{
          this.dataForm = this.$options.data().dataForm
          //this.$refs.dataFormRef.resetFields();
          //this.$refs['dataFormRef'].resetFields()
          this.getDataList()
        })
      },
      filterNode(value, data) {
        if (!value) return true;
        return data.label.indexOf(value) !== -1;
      },
      async getUnits() {
        const res = await this.$http({
          url: '/base/basedict/getDict',
          method: 'get',
          params: this.$http.adornParams({
            'code': 'UNIT'
          })
        })
        let data = res.data
        if (data && data.code === 0) {
          this.units = data.data
        }
      },
      async getSupplies() {
        let store = JSON.parse(sessionStorage.getItem("store"));
        const {
          data
        } = await this.$http({
          url: '/goods/goodssupplier/getSupplies',
          method: 'get',
          params: this.$http.adornParams({
            'storeId': store ? store.storeId : null
          })
        })
        if (data && data.code === 0) {
          this.supplies = data.data
        }
      },
      async getTreeData() {
        const res = await this.$http({
          url: '/goods/goodscategory/getTreeData',
          method: 'get',
        })
        let data = res.data
        if (data && data.code === 0) {
          this.treeData = data.data
        }
      },
      // 获取数据列表
      async getDataList() {
        this.dataListLoading = true
        const res = await this.$http({
          url: '/goods/goods/list',
          method: 'get',
          params: this.$http.adornParams({
            'page': this.pageIndex,
            'limit': this.pageSize,
            'dataForm': this.dataForm
          })
        })
        let data = res.data
        if (data && data.code === 0) {
          // this.dataList = data.page.list
          this.totalPage = data.page.totalCount

          this.dataList = data.page.list;
          this.dataList.forEach(item => {
            item.status = item.status == 1 ? true : false
            item["edit"] = false;
          });

        } else {
          this.dataList = []
          this.totalPage = 0
        }
        this.dataListLoading = false
      },
      handleNodeClick(data) {
        this.dataForm.categoryId = data.id
        this.getDataList()
      },
      // 每页数
      sizeChangeHandle(val) {
        this.pageSize = val
        this.pageIndex = 1
        this.getDataList()
      },
      // 当前页
      currentChangeHandle(val) {
        this.pageIndex = val
        this.getDataList()
      },
      // 多选
      selectionChangeHandle(val) {
        this.dataListSelections = val
      },
      // 新增 / 修改
      addOrUpdateHandle(id) {
        this.addOrUpdateVisible = true
        this.$nextTick(() => {
          this.$refs.addOrUpdate.init(id)
        })
      },
      // 删除
      deleteHandle(id) {
        var ids = id ? [id] : this.dataListSelections.map(item => {
          return item.goodsId
        })
        this.$confirm(`确定对[id=${ids.join(',')}]进行[${id ? '删除' : '批量删除'}]操作?`, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(() => {
          this.$http({
            url: this.$http.adornUrl('/goods/goods/delete'),
            method: 'post',
            data: this.$http.adornData(ids, false)
          }).then(({
            data
          }) => {
            if (data && data.code === 0) {
              this.$message({
                message: '操作成功',
                type: 'success',
                duration: 1500,
                onClose: () => {
                  this.getDataList()
                }
              })
            } else {
              this.$message.error(data.msg)
            }
          })
        })
      },
      //保存当前行
      async saveCurrentRowHanlde(){
        let currentData = this.$http.adornData(this.currentData);
        const {data} = await this.$http({
          url: '/goods/goods/update',
          method: 'post',
          data: currentData
        })
        if (data && data.code === 0) {
          this.$message({
            message: '操作成功',
            type: 'success',
            duration: 1500,
            onClose: () => {
              this.getDataList()
            }
          })
        } else {
          this.$message.error(data.msg)
        }
      },
      // 当input失去光标后进行的操作
      async blurInput(row, name, value) {
        // 判断数据是否有所改变，如果数据有改变则调用修改接口
        if (this.oldData[name] != value) {
          row[name] = value
          if(value === true){
            row[name] = 1
          }else if(value === false){
            row[name] = 0
          }
        }
        this.showInput = ""
        this.currentData = row
      },
      /*
      方法参数皆为框架方法的默认传参
      row     行数据
      column  被点击的触发了方法的单元格
      event   事件
      */
      tableDbEdit(row, column, event) {
        this.showInput = column.property + row.goodsId
        this.oldData[column.property] = row[column.property]
      },
      saveHandle(row){
        this.$confirm(`您确定要修改吗?`, '提示', {
          confirmButtonText: '确定',
          cancelButtonText: '取消',
          type: 'warning'
        }).then(async () => {
            row.status = row.status ? 1 : 0
            const res = await this.$http({
                 url:`/goods/goods/updateStatus`,
                 method: 'post',
                 data: this.$http.adornData(row)
            });
            let data = res.data
            if (data && data.code !== 0) {
              row.status = !row.status;
              return this.$message.error('修改失败!');
            }
            this.$message.success('更新成功！');
            this.getDataList();
        })
      },
    }
  }
</script>
<style lang="less" scoped>
  .filter-tree {
    background-color: white;
  }

  .el-col:nth-child(2) {
    padding-left: 20px;
  }

  .el-select {
    max-width: 100px;
  }
  .el-input{
    margin: 0px;
  }
</style>
